<template>
  <view class="tp-day-items" id="tp-day-items-card">
    <tp-step v-for="(d, idx) in dayItems" 
      :first="d.first"
      :last="d.last"
      :active="true"
      :lineGray="true"
      :dashed="true"
      :icon="d.icon"
      :key="d.day +'-'+ d.seq + '-' + idx">
      
      <tp-view-card v-if="d.node == 'attr' || d.node == 'diet' || d.node == 'hotel'"
        :place-id="d.content.placeId"
        :place-name="d.content.place"
        :place-type="d.content.placeType"
        :times="d.content.times"
        :times-desc="d.content.timesDesc"
        :images="d.content.images"
        :links="d.content.links"
        :stars="d.content.stars"
        :hot="d.content.hot"
        :budget="d.content.budget"
        :content="d.content.content">
      </tp-view-card>
      
      <tp-text-card v-if="d.node == 'rest'"
        title="自由活动"
        :times="d.content.times"
        :text="d.content.text"></tp-text-card>

      <tp-text-card v-if="d.node == 'hotel_start'"
        title="酒店出发"
        :times="d.content.times"
        :text="d.content.text"></tp-text-card>
        
      <tp-text-card v-if="d.node == 'return'"
        title="返程"
        :times="d.content.times"
        :text="d.content.text"></tp-text-card>

      
      <tp-drection-card v-if="d.node == 'traffic'"
       :consume="d.content.consume"
       :distance="d.content.distance"
       :by="d.content.by"
       :from="d.content.from"
       :to="d.content.to">
      </tp-drection-card>
  
      <tp-summary-card v-if="d.node == 'summary'"
       :content="d.content.text">
      </tp-summary-card>
    </tp-step>
  </view>
</template>

<script>
  export default {
    name:"tp-day-items",
    props: {
      dayItems: {
        type: Array,
        default: []
      }
    },
    data() {
      return {
        
      };
    }
  }
</script>

<style lang="scss">
  @import "@/styles/_var.scss";
  .tp-day-items {
  }
</style>